/*
 获取用户收货地址
  1.绑定点击事件
  2.调用小程序内置api 获取用户的收货地址 wx.chooseAddress
  3 获取用户对小程序 所授予获取地址的 权限 状态scope
    3.1 假设用户点击获取收货地址提示框 确定  authSetting scope.address
    scope 值 ture   直接调用 获取收货地址
    3.2 假设用户点击获取收货地址提示框 取消  
    scope 值 false
      1.诱导用户 自己打开 授权设置页面wx.openSetting 当用户重新给与 获取地址权限的时候
      2.获取收货地址
    3.3 假设 用户 从来没有调用过 收货地址的api
    scope 值 undefined  直接调用 获取收货地址
页面加载完毕
    1.获取本地存储中的数据
    2.把数据 设置给data中的一个变量
onshow
    0. 回到了商品详情页面 第一次添加商品的时候 手动添加了属性
      1.添加了 num = 1
      2.添加了 选中状态 checked = true
    1.获取缓存中的购物车数组
    2.把购物车数据 填充到data中
全选的实现 数据的展示
    1.onshow 获取缓存中的购物车数组
    2.根据购物车的商品数据是否选中状态 所有的商品都被选中 checked=true全选就被选中
总价格和总数量
    1.都需要商品被选中 才拿它来计算
    2.获取购物车数组
    3.遍历  判断商品是否被选中
    4.总价格： += 商品的单价 * 商品数量
    5.总数量： += 商品数量
    6.把计算后的总价格和总数量 设置回data中 
商品的选中状态操作
    1.绑定change事件
    2.获取到被修改的商品对象
    3.商品对象的选中状态 取反
    4.重新填充回data中和缓存中
    5.重新计算全选、总价格、总数量..
全选和反选
    1.全选复选框绑定事件 change
    2.获取 data中的全选变量 allChecked
    3.直接取反 allChecked = ！allChecked
    4.遍历购物车数组 让里面商品选中状态跟随 allChecked 改变而改变
    5.把购物车数组 和 allChecked 重新设置回data中，并设置回缓存中 
商品数量的编辑
    1. +、- 按钮 绑定同一个事件 区别的关键是 自定义属性
       1. +号 就+1
       2. -号 就-1
    2.传递被点击的商品id goods_id
    3.获取data中的购物车数组 通过商品id来获取需要被修改的商品对象
    4.直接修改商品对象的数量 num
      当购物车的数量 = 1 同时用户再点击-按钮
         弹窗提示wx.showModal 询问用户 是否要删除
           1.确定 直接执行删除
           2.取消 什么都不做
    5.把cart数组 重新设置回 缓存和data中 调用封装方法 
点击结算 (绑定点击事件)
   1.判断有没有收货地址信息
   2.判断用户有没有选购商品
   3.经过以上的验证 就跳转到 支付页面

*/
//引入封装的api功能函数
import { getSetting,chooseAddress,openSetting,showModal,showToast } from "../../utils/asyncWx.js"; 
Page({
  data: {
    address: {}, //收货地址数据
    cart: [], //购物车数据
    allChecked: false, //全选的状态
    totalPrice: 0, //总价格
    totalNum: 0 // 总数量
  },
   
  //页面出现在前台时执行
  onShow() {
    // 1. 获取缓存中的收货地址数据
    const address = wx.getStorageSync("address");
    // 2. 获取缓存中的购物车数据 没有数据时转成数组 （因为没有数据是空对象，全选需要数组）
    const cart = wx.getStorageSync("cart") || [];
    // 3. 计算全选
    // every 数组方法 会遍历 会接收一个回调函数 如果每一个回调函数都返回true 那么every方法就返回值为true
    //       只要 有一个回调函数返回了false，就不再遍历循环了，直接返回false出去。
    // 注意： 空数组 调用every 返回的值也是true
    // const allChecked =cart.length>0?cart.every(v=>v.checked): false;
    // 4.收货地址设置回data中
    this.setData({
      address
    });
    // 5.调用封装的方法 （修改的商品状态的时候，重新计算）
    this.setCart(cart);
   
  },

  // 1.点击收货地址
  async handleChooseAddress() {
    //2.获取 权限状态
    // wx.getSetting({
    //   success: (result) => {
    //     //拿权限状态  属性后面出现.重复 使用['']形式来获取属性值
    //     const scopeAddress = result.authSetting["scope.address"]
    //     //判断是否已经有授予权限 或 从来没有赋予权限
    //     if (scopeAddress === true || scopeAddress === undefined) {
    //       //直接获取用户收货地址
    //       wx.chooseAddress({
    //         success: (result1) => {
    //           console.log(result1);
    //         },
    //         fail: () => {},
    //         complete: () => {}
    //       });
    //     } else {
    //       // 用户以前拒绝授予权限，要诱导用户打开授权页面
    //       wx.openSetting({
    //         success: (result2) => {
    //           // 打开权限授予页面，可以调用收货地址代码
    //           wx.chooseAddress({
    //             success: (result3) => {
    //               console.log(result3);
    //             },
    //             fail: () => {},
    //             complete: () => {}
    //           });
    //         },
    //       });
    //     }
    //   },
    //   fail: () => {},
    //   complete: () => {}
    // });
    try {
      //2.获取 权限状态
      const res = await getSetting()
      //3.拿权限状态  属性后面出现.重复 使用['']形式来获取属性值'
      const scopeAddress = res.authSetting["scope.address"];
      //4.判断是否已经有授予权限 或 从来没有赋予权限
      if (scopeAddress === false) {
        // 用户以前拒绝授予权限，要诱导用户打开授权页面
        await openSetting();
      }
      //5. 打开权限授予页面，可以调用收货地址代码
      let address = await chooseAddress();
      // 存入缓存前 把收货地址信息进行拼接
      address.all = address.provinceName + address.cityName + address.countyName + address.detailInfo;
      // 把获取的收货地址存入缓存中
      wx.setStorageSync("address", address);
    } catch (error) {
      console.log(error);
    }
  },

  //商品的选中
  handleItemChange(e) {
    // 1.获取被修改的商品的id
    const goods_id = e.currentTarget.dataset.id;
    // 2.获取购物车数组
    const { cart } = this.data;
    // 3.找到被修改的商品对象（先找修改商品的索引index）
    const index = cart.findIndex(v => v.goods_id === goods_id);
    // 4.根据索引找到商品进行选中状态取反
    cart[index].checked = !cart[index].checked;
    // 5.6 把购物车数据重新设置回data中和缓存中
    this.setCart(cart); //调用封装的方法

  },

  // 封装 修改购物车状态同时 重新计算 底部工具栏的数据 全选、总价格、购买的数量
  setCart(cart) {
    // 重新计算全选、总价格、总数量..
    let allChecked = true;
    // 计算 总价格 总数量
    let totalPrice = 0;
    let totalNum = 0;
    cart.forEach(v => {
      if (v.checked) {
        totalPrice += v.goods_price * v.num;
        totalNum += v.num;
      } else {
        allChecked = false; //有一个数据是false就不全选
      }
    });
    // 最后欧再判断数组是否为空
    allChecked = cart.length != 0 ? allChecked : false;
    this.setData({ //把购物车数据重新设置回data中
      cart,
      totalPrice,
      totalNum,
      allChecked
    })
    // 把购物车数据重新设置回缓存中
    wx.setStorageSync("cart", cart);
  },

  // 商品全选的功能
  handleItemAllCheck() {
    // 1.获取data中的数据
    let { cart,allChecked } = this.data;
    // 2.修改值
    allChecked = !allChecked;
    // 3.循环修改cart数组中的每一个商品的选中状态 = 修改的状态
    cart.forEach(v => v.checked = allChecked);
    // 4.把修改后值 设置回data和缓存中
    this.setCart(cart) //调用封装的方法
  },

  //商品数量的编辑功能
  async handleItemNumEdit(e) {
    // 1.获取传递过来的参数
    const { operation, id } = e.currentTarget.dataset;
    // 2.获取购物车数组
    let { cart} = this.data;
    // 3.找到需要修改商品的索引
    const index = cart.findIndex(v => v.goods_id === id);
    // 判断是否要执行删除商品
    if (cart[index].num === 1 && operation === -1) {
      //弹窗提示  调用封装弹窗api
      const res = await showModal({
        content: "你确定要删除该商品吗？"
      });
      if (res.confirm) {
        cart.splice(index, 1); //删除购物车数组的指定的元素(索引值，删除一个)
        this.setCart(cart); //调用封装的方法
      }
    } else {
      // 4.找到相应的商品进行修改数量
      cart[index].num += operation;
      // 5.把数组设置回缓存和data中
      this.setCart(cart); //调用封装方法      
    }
  },

  //点击结算功能
  async handlePay(){
    // 1. 获取data数据中的收货地址数据 并解构需要的数据
    const { address,totalNum } = this.data;
    console.log(address,totalNum);
    // 2.判断是否有收货地址
    if (!address.userName) {   
        await showToast({title:"你还没有选择收货地址"});
        return;
    }
    // 3.再判断用户是否选有商品
    if (totalNum === 0) {
        await showToast({title:"你还没有选购商品"});
      return;
    }
    // 4. 以上都验证通过就 跳转到支付页面 
    wx.navigateTo({
      url: '/pages/pay/index',
    });
  } 

})